﻿@model PublishNews.Entities.Banner

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="col-md-6 banner-page">
    @using (Html.BeginForm("UpdateBanner", "Banner", null, FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
        @Html.HiddenFor(x => x.Id);
        <div class="form-group">
            <label for="url">Url</label>
            <input type="text" class="form-control" name="url"  value="@Model.LinkUrl"/>
        </div>
        <div class="form-group">
            @if (!string.IsNullOrEmpty(Model.ImageUrl))
            {
                <div>
                    <label>Image</label>
                    <a class="btn btn-danger delete-image">Delete Image</a>
                </div>
                <br/>
                <img src="@Model.ImageUrl" alt=""/>
                @Html.HiddenFor(x => x.ImageUrl, new { @class = "image-url" });
            }
            <div class="upload-image">
                <input name="image" type="file" multiple="" />
            </div>
        </div>
        
        <input type="submit" class="btn btn-primary submit" name="submit" value="Submit" />
        
    }
    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>
</div>
@section scripts{
    <script>
        var app = angular.module("app", ["xeditable"]);
        $(document).ready(function () {
            var imageUrl = $('.image-url').val();
            if (!imageUrl) {
                $('.upload-image').show();
                $('.delete-image').hide();
            } else {
                $('.upload-image').hide();
            }

            $('.delete-image').click(function () {
                $(this).hide();
                $('.form-group img').remove();
                $('.image-url').remove();
                $('.upload-image').show();
            });
        });
    </script>
}